<%@ taglib uri="/struts-tags" prefix="s"%>
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ page pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>大学专业双向选择系统</title>
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">
<script src="js/jquery-3.2.0.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<style>
html,body {
	height: 100%;
}

.wq-index-background {
	width: 100%;
	height: 100%;
	background: url('img/background.jpg') no-repeat;
	background-size: cover;
}
</style>
</head>
<body>
	<style>
.header {
	padding: 10px;
	width: 100%;
	height: 70px;
	background: #333;
}

a {
	font-style: none;
}

.wq-title {
	color: #999;
	font-size: 25px;
	font-weight: 900
}
</style>

	<section style="width: 100%; height: 100%;">
		<table style="width: 100%; height: 100%;">
			<tr>
				<td colspan="2" class="navbar navbar-inverse header"><a
					href="http://www.jci.edu.cn/"> <img src="img/logo.png"
						width="50px" /> <span class="wq-title">大学专业双向选择系统</span> </a></td>
			</tr>
			<tr>
				<td style="width: 15%; vertical-align: top; padding-top: 10px;">
					<div id="ul_body" class="list-group">
						<s:iterator value="action.getAction()" var="a">
							<a href="<s:property value="#a.value"/>" target="main"
								class="list-group-item"><s:property value="#a.key" />
							</a>
						</s:iterator>
					</div></td>
				<td style="width: 85%; vertical-align: top; position: relative;">
					<iframe name="main"
						style="width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0;"
						src="public/welcome.html"></iframe></td>
			</tr>
		</table>
	</section>
	<script>
		var $ul_body_a = $('#ul_body a');
		console.log($ul_body_a);
		$ul_body_a.on('click',function(){
			var $this = $(this);
			$ul_body_a.removeClass('active');
			$this.addClass('active');
		});
		console.log($ul_body_a);
	</script>
</body>
</html>